{% extends 'base.html'%}

{% block content %}


<head>
<!--<script type="text/javascript" src="/my-media/js/jquery.js"></script>
<script type="text/javascript" src="/my-media/js/jquery.innerfade.js"></script>
<script type="text/javascript" src="/my-media/js/jquery.form.js"></script>
<script type="text/javascript">
$( document ).ready( function() {
	$('#portfolio').innerfade({
		
		speed: 'slow',
		timeout: 4000,
		type: 'sequence',
		containerheight: '220px'
	});

	
$( '#commentSubmit' ).click( function() {
		alert('Your data has been saved.');
		
  });
 
}); 
</script>
    --><script type="text/javascript" src="/my-media/js/jquery.pack.js"></script>
    <script type="text/javascript" src="/my-media/js/jquery.uploadPreview.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            
            $("#id_image").uploadPreview({ width: 200, height: 200, imgDiv: "#imgDiv", imgType: ["bmp", "gif", "png", "jpg"] });


           });
</script>
</head>
<body>


{% if user.is_authenticated %}
 <div id="left">
hello {{ user }}
<img src="/my-media/{{useraccount.image}}" width="108" height="132" border="0" />

<br>You have  credit {{ useraccount.credit }}</br>


<p>You can view your historical transaction here</p>

   <table >

<tr><th>StockName</th><th>StockAmount</th><th>type</th></tr>

{% for n in transaction %}

        <tr><td>{{ n.stock.stock_name }}</td>
        <td>{{ n.amount }}</td>
        <td>{{ n.type }}</td></tr>
        

{% endfor %}
    </table><!--  
 <div> 
    
<ul id="portfolio"> 
	<li>
		<a href="/">
			<img src="/my-media/thumbnails/xmlimg4.jpg" alt="the social stock market" />
		back to home</a>
	</li>
	<li>
		<a href="/users/logout">
			<img src="/my-media/thumbnails/xmlimg2.jpg" alt="logout" />
		logout</a>
	</li> 

</ul>	

</div>
--></div>
	  
	  <div id="right">
	  you can upload and change your profile image from here
<form id="form1" runat="server" enctype="multipart/form-data" method="POST" action="">	
	
				{{ form }}				
				<input id="commentSubmit" type="submit" name="submit" value="submit" />
			    <br />
    	<div style="width: 200px; height: 200px; overflow: hidden; border: 1px solid green;">
        <div id="imgDiv">
                </div>
    			</div>
			</form>
<p><a href="/users/friend/">Friend</a></p>
<p><a href="/users/stock/">view stock</a></p>
<p><a href="/users/changepassword/">modify profile information</a></p>
<p><td><a href="/personalstock/perstockdetail/"? rel='lyteframe' title='Now viewing request' rev='width: 600px; height: 200px; scrolling: yes;' >personal stock management</a></p>
<p><a href="/users/logout/">Logout</a></p>


      </div>

{%endif%}
</body>

{%endblock%}


